<%@ page language="java" contentType="text/html; charset=utf-8"	pageEncoding="utf-8"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
   <title></title>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<%@include file="/common/common_header.jsp"%>
  	<link href="${ctx}/static/css/base.css" rel="stylesheet" type="text/css" />
    <link href="${ctx}/static/css/default.css" rel="stylesheet" type="text/css" />
	<script type="text/javascript" src="${ctx}/static/js/echarts.js"></script>
</head>
<body>    

	<div id="chart" style="width:100%;height:100%;"></div>
	<script type="text/javascript">
	$(function(){
		 //ajax调用
        $.ajax({
            type: "post",
            dataType: "json",
            url:  _global_web_app_path+"/stock_info_chart/chart_data_money",
            error: function (e) {
                $.messager.alert('错误', e.responseText, 'error');
            },
            success: function (data) {
           	   // 基于准备好的dom，初始化echarts实例
                var myChart = echarts.init(document.getElementById('chart'));
				
           	   var name_array=[];
           	   
             for(i=0;i<data.length;i++){
            	 name_array.push(data[i].name);
               }
           	   
             var option = {
            		    title : {
            		        text: '库存商品成本占比分析',
            		        subtext: '成本分布',
            		        x:'center'
            		    },
            		    tooltip : {
            		        trigger: 'item',
            		        formatter: "{a} <br/>{b} : {c} ({d}%)"
            		    },
            		    legend: {
            		        orient: 'vertical',
            		        left: 'left',
            		        data: name_array
            		    },
            		    series : [
            		        {
            		            name: '商品',
            		            type: 'pie',
            		            radius : '55%',
            		            center: ['50%', '60%'],
            		            data:data,
            		            itemStyle: {
            		                emphasis: {
            		                    shadowBlur: 10,
            		                    shadowOffsetX: 0,
            		                    shadowColor: 'rgba(0, 0, 0, 0.5)'
            		                }
            		            }
            		        }
            		    ]
            		};
                // 使用刚指定的配置项和数据显示图表。
                myChart.setOption(option);            	
            }
        });
		
	});
	 
	</script>    
</body>
</html>